<template>
	<div class="evidence-unit-evidence-container">
		<el-form ref="refSeach" :inline="true" :model="formInline" size="mini">
			<el-form-item label-width="100px" label="案件编号" prop="caseNo">
				<el-input v-model="formInline.caseNo" placeholder="请输入..."></el-input>
			</el-form-item>
			<el-form-item label-width="100px" label="关联编号" prop="inspectionNo">
				<el-input v-model="formInline.inspectionNo" placeholder="请输入..."></el-input>
			</el-form-item>
			<el-form-item label-width="100px" label="案件名称" prop="caseName">
				<el-input v-model="formInline.caseName" placeholder="请输入..."></el-input>
			</el-form-item>
			<el-form-item label-width="100px" label="案发时间" prop="caseTime">
				<el-date-picker
					v-model="formInline.caseTime"
					format="YYYY-MM-DD"
					value-format="YYYY-MM-DD"
					type="daterange"
					start-placeholder="开始时间"
					end-placeholder="结束时间"
					style="width: 220px"
				>
				</el-date-picker>
			</el-form-item>
			<el-form-item label-width="100px" label="物品编号" prop="evidenceNo">
				<el-input v-model="formInline.evidenceNo" placeholder="请输入..."></el-input>
			</el-form-item>
			<el-form-item label-width="100px" label="物品名称" prop="evidenceName">
				<el-input v-model="formInline.evidenceName" placeholder="请输入..."></el-input>
			</el-form-item>
			<el-form-item label-width="100px" label="物品状态" prop="evidenceStatus">
				<el-select v-model="formInline.evidenceStatus" placeholder="请选择...">
					<el-option label="请选择" :value="-1"></el-option>
					<el-option label="登记" :value="0"></el-option>
					<el-option label="入库" :value="1"></el-option>
					<el-option label="出库" :value="2"></el-option>
				</el-select>
			</el-form-item>
			<!--	<el-form-item label-width="100px" label="提取人" prop="personName">
				<el-input v-model="formInline.personName" placeholder="请输入..."></el-input>
			</el-form-item>-->
			<el-form-item label-width="100px" label="获取时间" prop="caseTime">
				<el-date-picker
					v-model="formInline.extractionDateTime"
					type="daterange"
					format="YYYY-MM-DD"
					value-format="YYYY-MM-DD"
					start-placeholder="开始时间"
					end-placeholder="结束时间"
					style="width: 220px"
				>
				</el-date-picker>
			</el-form-item>
			<el-form-item label-width="100px" label="登记时间" prop="caseTime">
				<el-date-picker
					v-model="formInline.createDateTime"
					type="daterange"
					format="YYYY-MM-DD"
					value-format="YYYY-MM-DD"
					start-placeholder="开始时间"
					end-placeholder="结束时间"
					style="width: 220px"
				>
				</el-date-picker>
			</el-form-item>
			<el-form-item style="margin-left: 20px">
				<el-button type="primary" @click="onSearch" icon="el-icon-search" size="small">查询</el-button>
				<el-button type="primary" @click="onRest" icon="el-icon-view" size="small">重置</el-button>
			</el-form-item>
		</el-form>
		<el-table
			ref="multipleTable"
			:data="tableData"
			:default-sort="{ prop: 'name', order: 'descending' }"
			:row-style="{ height: '0' }"
			:cell-style="{ padding: '0' }"
			size="medium"
			style="width: 100%"
			highlight-current-row
			:row-class-name="tableRowClassName"
			@row-dblclick="rowDblclick"
			@selection-change="handleSelectionChange"
		>
			<el-table-column align="center" type="selection" width="55" />
			<el-table-column align="center" label="序号" type="index" width="60"> </el-table-column>
			<el-table-column align="center" property="caseNo" width="180" sortable label="案件编号" show-overflow-tooltip />
			<el-table-column align="center" property="inspectionNo" width="180" sortable label="关联编号" show-overflow-tooltip />
			<el-table-column align="center" property="caseName" sortable label="案件名称" show-overflow-tooltip />
			<el-table-column align="center" property="evidenceNo" width="200" sortable label="物品编号" show-overflow-tooltip />
			<el-table-column align="center" property="casePerson" sortable label="物品名称/数量" show-overflow-tooltip>
				<template #default="scope">{{ `${scope.row.evidenceName}/${scope.row.evidenceQuantity}` }}</template>
			</el-table-column>
			<!--
			<el-table-column v-show="false" align="center" property="caseOrg" sortable label="物品类别" show-overflow-tooltip>
				<template #default="scope">{{ `${scope.row.evidenceClassName}/${scope.row.evidenceCategoryName}` }}</template>
			</el-table-column>-->
			<el-table-column align="center" property="evidencePerson" label="颜色/获取时间" show-overflow-tooltip>
				<template #default="scope">{{ `${scope.row.extractionPersonName}/${dateFormat(scope.row.extractionDateTime)}` }}</template>
			</el-table-column>
			<el-table-column align="center" property="location" sortable label="存放位置" show-overflow-tooltip />
			<el-table-column align="center" property="status" sortable label="状态" show-overflow-tooltip>
				<template #default="scope">{{ getEvidenceStatus(scope.row.status) }}</template>
			</el-table-column>
			<el-table-column align="center" label="操作" width="150px">
				<template #default="scope">
					<el-button type="primary" @click="onEditEviInfo(scope.row)" plain size="mini">修改</el-button>
					<el-button type="success" @click="onDetailsInfo(scope.row)" plain size="mini">详情</el-button>
				</template>
			</el-table-column>
		</el-table>
		<el-pagination
			:page-sizes="[10, 20, 50, 100]"
			:page-size="formInline.pageSize"
			layout="prev, pager, next, jumper,total,sizes"
			:total="total"
			@size-change="onHandleSizeChange"
			@current-change="onHandleCurrentChange"
			prev-text="上一页"
			next-text="下一页"
			background
		>
		</el-pagination>
		<EditEvi ref="editEviRef" />
	</div>
</template>

<script lang="ts">
import { ref, reactive, toRefs } from 'vue';
import { useRouter } from 'vue-router';
import EditEvi from '/@/views/evidence/unit/component/editEvi.vue';
import { queryPagerCaseEvidences, deleteEvidence } from '/@/api/evidence/index';
import { dateFormat } from '/@/common/index';
import { ElMessageBox, ElMessage } from 'element-plus';
import { savePanDianTask } from '/@/api/case/index';
import { getEvidenceStatus } from '/@/common/index';

export default {
	name: 'EvidenceUnitCase',
	components: { EditEvi },
	setup() {
		const state = reactive({
			formInline: {
				caseNo: '',
				inspectionNo: '',
				caseName: '',
				caseTime: '',
				evidenceNo: '',
				evidenceName: '',
				evidenceStatus: -1,
				personName: '',
				extractionDateTime: '',
				caseTimeStart: '',
				caseTimeEnd: '',
				extractionDateTimeStart: '',
				extractionDateTimeEnd: '',
				createDateTime: '',
				createStartDateTime: '',
				createEndDateTime: '',
				page: 1,
				pageSize: 10,
			},
			tableData: [],
			total: 0,
			checkRecords: [],
		});
		const editEviRef = ref();
		const router = useRouter();
		const onEditEviInfo = (row: any) => {
			editEviRef.value.openDialog(row);
		};
		const onDetailsInfo = (row: any) => {
			router.push({
				path: '/evidence/unit/details',
				query: { caseid: row.caseId },
			});
		};
		const tableRowClassName = (row: any, rowIndex: number) => {
			if (rowIndex === 1) {
				return 'warning-row';
			} else if (rowIndex === 3) {
				return 'success-row';
			}
			return '';
		};
		function init() {
			state.formInline.caseTimeStart = '';
			state.formInline.caseTimeEnd = '';
			state.formInline.extractionDateTimeStart = '';
			state.formInline.extractionDateTimeEnd = '';
			state.formInline.createStartDateTime = '';
			state.formInline.createEndDateTime = '';
			if (state.formInline.caseTime && state.formInline.caseTime.length > 1) {
				state.formInline.caseTimeStart = state.formInline.caseTime[0];
				state.formInline.caseTimeEnd = state.formInline.caseTime[1];
			}
			if (state.formInline.extractionDateTime && state.formInline.extractionDateTime.length > 1) {
				state.formInline.extractionDateTimeStart = state.formInline.extractionDateTime[0];
				state.formInline.extractionDateTimeEnd = state.formInline.extractionDateTime[1];
			}
			if (state.formInline.createDateTime && state.formInline.createDateTime.length > 1) {
				state.formInline.createStartDateTime = state.formInline.createDateTime[0];
				state.formInline.createEndDateTime = state.formInline.createDateTime[1];
			}
			queryPagerCaseEvidences(state.formInline).then((res: any) => {
				if (res.success) {
					state.tableData = res.data.data;
					state.total = res.data.totalCount;
				}
			});
		}
		const refSeach = ref();
		function onSearch() {
			init();
		}
		function onRest() {
			refSeach.value.resetFields();
			state.formInline.extractionDateTime = '';
			state.formInline.createDateTime = '';
		}
		function handleSelectionChange(value) {
			state.checkRecords = value;
		}
		async function onDelete() {
			if (!verify()) return false;
			await ElMessageBox.confirm('是否刪除?')
				.then(() => {
					const ids = state.checkRecords.map((x) => {
						return x.evidenceId;
					});
					deleteEvidence({ ids: ids }).then((res: any) => {
						if (res.success) {
							ElMessage({
								message: '操作成功',
								type: 'success',
							});
							init();
						}
					});
				})
				.catch(() => {});
		}

		function getRand(min, max) {
			var rand = Math.random();
			return Math.round(min + rand * (max - min));
		}
		async function pandian() {
			if (!verify()) return false;
			var num = getRand(100000, 999999);
			var taskdata = new Array();
			for (var i = 0; i < state.checkRecords.length; i++) {
				var _data = state.checkRecords[i];
				if(_data.rfid || _data.evidenceNo){
					taskdata.push({ evid: _data.evidenceId ,evidenceName: _data.evidenceName, address: _data.location, epc: _data.rfid || _data.evidenceNo, registerState: 1 });
				}
			}
			if(taskdata.length == 0){
				ElMessage({
					message: '无可盘点物品！',
					type: 'warning',
				});
				return;
			}
			pandianForMR730(taskdata);
		}
		async function pandianForMR730(taskdata) {
			var ids = taskdata.map(function(a){ return a.evid;});

			ElMessageBox.prompt('请输入盘点计划名称：', '盘点', {
				confirmButtonText: '确定',
				cancelButtonText: '取消'
			}).then(({ value }) => {
				if(value){
					var data = { name: value, ids: ids };
					savePanDianTask(JSON.stringify(data)).then((res) => {
						if (res.success) {
							ElMessage({ message: '盘点计划,添加成功', type: 'success' });
						} else {
							ElMessage.error(res.msg);
						}
					});
				}
			}).catch(() => {
				//取消
			}); 
		}
		function verify() {
			if (state.checkRecords.length < 1) {
				ElMessage({
					message: '请选择物品盘点',
					type: 'warning',
				});
				return false;
			}
			return true;
		}
		function onHandleSizeChange(pageSize: number) {
			state.formInline.pageSize = pageSize;
			init();
		}
		function onHandleCurrentChange(pageIndex: any) {
			state.formInline.page = pageIndex;
			init();
		}

		function rowDblclick(row: any) {
			router.push({
				path: '/evidence/unit/details',
				query: { caseid: row.caseId },
			});
		}

		init();
		return {
			pandian,
			editEviRef,
			tableRowClassName,
			onDetailsInfo,
			rowDblclick,
			onEditEviInfo,
			onSearch,
			refSeach,
			onRest,
			onDelete,
			dateFormat,
			handleSelectionChange,
			onHandleSizeChange,
			getEvidenceStatus,
			onHandleCurrentChange,
			...toRefs(state),
		};
	},
};
</script>
<style scoped>
.el-input,
.el-select,
.el-date-picker {
	width: 220px;
}
</style>
